<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>后盾人</title>
  </head>

  <body>
    <style>
      .paste {
        width: 500px;
        height: 400px;
        border: 2px solid;
      }
    </style>
    <div class="paste"></div>
  </body>
  <script>
    const pasteDom = document.querySelector('.paste');

    pasteDom.addEventListener('paste', function (e) {
      console.log(e.clipboardData.items);
      const items = e.clipboardData.items;
      const curItem = [...items].find((file) => {
        return file.type.includes('image');
      });
      const file = curItem.getAsFile();
      console.log('file', file);
      if (file) {
        const fd = new FileReader();
        fd.readAsDataURL(file);
        fd.onload = function (event) {
          const imgDom = new Image();
          imgDom.width = pasteDom.clientWidth / 2;
          imgDom.src = event.target.result;
          pasteDom.appendChild(imgDom);
        };
      }
    });

    // let p1 = new Promise(resolve => {
    //   setTimeout(() => {

    //     console.log("setTimeout");
    //   }, 0);
    //   console.log("promise");
    // })
    // console.log(1);

    new Promise((resolve, reject) => {
      console.log('Promise-构造');
      setTimeout(() => {
        resolve();
        console.log('Promise-setTimeout');
      });
    }).then(() => {
      console.log('then');
    });
    let a = async () => {
      console.log('async-fn');
      // const c = await p1
    };
    setTimeout(() => {
      a().then(() => {
        console.log('async-then');
      });
      console.log('setTimeout');
    });
    console.log(77);
    // console.log(  a().then(val=>{},
    // ));
  </script>
</html>
